<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>登录</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta name="apple-mobile-web-app-capable" content="no" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <!-- UC应用模式 --> <meta name="browsermode" content="application"> 
    <!-- QQ应用模式 --> <meta name="x5-page-mode" content="app">
     <link rel="stylesheet" href="./css/common/reset.css">
     <link rel="stylesheet" href="./css/app/login.css">
     <link rel="stylesheet" href="./css/common/layer.css">
     <!-- <link rel="stylesheet" href="static/dateRangeCss.css"> -->
    <script src="./js/common/flexible.js"></script>
    <script src="./js/common/Storage.js"></script>
    <script src="./js/common/layer.js"></script>
    <script src="./js/common/jquery.min.js"></script>
    <script src="./js/common/config.js"></script>
    <script src="./js/common/tool.js"></script>
    <script src="./js/common/vue.js"></script>
      <!--<script src="//unpkg.com/vue-ydui/dist/ydui.js"></script>-->
      <!--<link rel="stylesheet" href="//unpkg.com/vue-ydui/dist/ydui.rem.css">-->

    

  </head>
  <body>
    <div id="app">
        <!--<template>-->
            <!--<yd-tab>-->
                <!--<yd-tab-panel label="选项一">土地是以它的肥沃和收获而被估价的；才能也是土地，不过它生产的不是粮食，而是真理。如果只能滋生瞑想和幻想的话，即使再大的才能也只是砂地或盐池，那上面连小草也长不出来的。</yd-tab-panel>-->
                <!--<yd-tab-panel label="选项二">我需要三件东西：爱情友谊和图书。然而这三者之间何其相通！炽热的爱情可以充实图书的内容，图书又是人们最忠实的朋友。</yd-tab-panel>-->
                <!--<yd-tab-panel label="选项三">时间是一切财富中最宝贵的财富。</yd-tab-panel>-->
                <!--<yd-tab-panel label="选项四">真理惟一可靠的标准就是永远自相符合。</yd-tab-panel>-->
            <!--</yd-tab>-->
        <!--</template>-->

        <div class="login">
            <div class="log-img">
                <img src="./assets/img/log.png">
            </div>
            <div class="flex-div">
                <div class="top">
                  <p class="top-left" :class='{bghui:login_type == 0||login_type==2||login_type==3}' @click="login_type=0" >登录</p>
                  <div class="top-center">|</div>
                  <p class="top-right" :class='{bghui:login_type == 1?true:false}' @click="login_type=1">注册</p>
                </div>
            </div>
            <div class="flex-div">
                <div class="cont">
                    <div class="cont-login" v-show="login_type==0">
                        <p><img src="./assets/icon/phone.png" ><input type="text"  placeholder="请输入手机号" v-model="login_tel"></p>
                        <p><img src="./assets/icon/password.png" ><input type="password" placeholder="请输入6-12位密码" v-model="login_pass"></p>
                        <div class="login-btn" @click="go_login">登录</div>
                        <div class="login-bottom">
                          <p class="login-bottom-left" @click="login_type=2">验证码登录</p>
                          <p class="login-bottom-right"  @click="login_type=3">忘记密码</p>
                        </div>
                    </div>
                    <div class="cont-regis" v-show="login_type==1">
                         <p><img src="./assets/icon/phone.png" ><input type="text"  placeholder="请输入手机号" v-model="regis_tel"></p>
                         <p class="cont-regis-p"><img src="./assets/icon/safe.png" height="43" width="32" > <input type="text"  v-model="yz_tel_code_1" class="yzcode" ><em @click="get_code" v-if="!code_show">{{yz_code}}</em> <em v-if="code_show" style="background-color: rgba(0,0,0,0.3);border-radius: 0.2rem;">{{yz_code}}</em></p>
                        <p><img src="./assets/icon/password.png" ><input type="password" placeholder="请输入6-12位密码" v-model="new_password"></p>
                        <div class="agree">
                            <div class="agree-ok" @click="agree_ok">
                              <!--<em v-show="agree_show">✔</em>-->
                                <img v-show="agree_show" src="./assets/icon/okmms.png" >
                                <img v-show="!agree_show" src="./assets/icon/okmm.png" >
                            </div>
          
                            <span  @click="agree_ok">注册表示您同意<em>《寓居公寓服务协议》</em></span>
                        </div>
                    <div class="login-btn" v-show="agree_show" @click="go_login_t1">注册</div>
                    <div class="login-btn" style="background-color: #a9a9a9; -webkit-box-shadow:2px 8px 13px  white, 2px 2px 5px white; box-shadow:2px 8px 13px white, 2px 2px 5px white;" v-show="!agree_show">注册</div>
                    </div>

                    <div class="yz-login" v-show="login_type==2">
                        <p><img src="./assets/icon/phone.png" ><input type="text"  placeholder="请输入手机号" v-model="yz_tel_num"></p>
                        <p class="cont-regis-p" ><img src="./assets/icon/safe.png" ><input type="text" class="yzcode" v-model="yz_tel_code"><em @click="get_code" v-if="!code_show">{{yz_code}}</em> <em v-if="code_show" style="background-color: rgba(0,0,0,0.3);border-radius: 0.2rem;">{{yz_code}}</em></p>
                        <div class="login-btn" @click="go_login_t2">登录</div>
                        <div class="login-bottom-right"  @click="login_type=0">密码登录</div>
                    </div>

                    <div class="reset-pass" v-show="login_type==3">
                       <p><img src="./assets/icon/phone.png" ><input type="text"  placeholder="请输入手机号" v-model="yz_tel_num_3"></p>
                        <p class="cont-regis-p"><img src="./assets/icon/safe.png" ><input type="text" class="yzcode" v-model="yz_tel_code_3"><em @click="get_code" v-if="!code_show">{{yz_code}}</em> <em v-if="code_show" style="background-color: rgba(0,0,0,0.3);border-radius: 0.2rem;">{{yz_code}}</em></p>
                        <p><img src="./assets/icon/password.png" height="44" width="36"  style="margin-top: 0;"><input v-model="pass_word_one" type="password"  placeholder="请输入新密码"></p>
                        <p><img src="./assets/icon/password.png" height="44" width="36" ><input type="password"  v-model="pass_word_two" placeholder="请再次输入新密码"></p>
                        <div class="login-btn" @click="go_login_t3">完成并登录</div>
                      
                    </div>
                  </div>
             </div>
           </div>

        </div>


    </div>
 <script src="./js/app/login.js"></script>

 
  </body>



</html>
